<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>ประปา</title>
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="assets/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<link href="assets/css/style.css" rel="stylesheet" />
<script src="assets/js/modernizr.js" type="text/javascript"></script>
</head>

<body>
<div class="wrapper">
<div id="header-bar"> <img src="assets/images/logo.png" height="50" id="main-logo"  /> </div>
<!-- END header-bar-->

<div id="top-bar" class="clearfix">
	<div class="pull-right">
		<ul class="bar-menu clearfix">
			<li class="envelope-main"><a href="javascript:void()"><i class="fa fa-cog"></i></a>
				<div class="popup-info">
					<div class="notification">
						<div class="clearfix" id="bg-change">
							<div class="pull-left">เลือกพื้นหลัง :</div>
							<div class="pull-left change-bg"  id="theme-bg-1"></div>
							<div class="pull-left change-bg" id="theme-bg-2"></div>
							<div class="pull-left change-bg"  id="theme-bg-3"></div>
							<div class="pull-left change-bg"  id="theme-bg-4"></div>
						</div>
					</div>
				</div>
			</li>
			<li class="envelope-main"><a href="javascript:void()"><i class="fa fa-envelope"></i> <span class="badge">2</span></a>
				<div class="popup-info">
					<div class="notification">Insert Notification</div>
				</div>
			</li>
			<li class="admin-info"><a href="javascript:void()"><i class="fa fa-user"></i> administrator</a>
				<div class="popup-info">
					<div class="notification">Insert Admin Info</div>
				</div>
			</li>
		</ul>
	</div>
</div>
<!-- END Top-Bar -->

<div id="detail-area" class="clearfix">
	<div class="hidden-xs hidden-sm page-sidebar" id="side-menu">
		<ul class="page-sidebar-menu">
			<li class="info ">
				<div class="clearfix">
					<div><strong>ยินดีต้อนรับ</strong></div>
					<div><i class="fa fa-user"></i> หัวหน้าส่วนงาน</div>
					<div class="mt-10"><strong>คุณเข้าระบบครั้งล่าสุดเมื่อ</strong></div>
					<div class="mb-10"><i class="fa fa-clock-o"></i> 23 / 04 / 2557 13:05:44</div>
				</div>
			</li>
			<li><a href="javascript:void()" ><i class="fa fa-briefcase"></i> การจัดการระบบ <span class="arrow"></span></a>
				<ul class="sub-menu">
					<li><a href="javascript:void(0)"  ><i class="fa fa-folder"></i> ตารางรหัสอ้างอิง <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลองค์กร</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมุลเขตผู้ใช้น้ำ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลประเภทผู้ใช้น้ำ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมุลรหัสรับเงิน</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลขนาดมาตรวัดน้ำ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลยี่ห้อมาตรวัดน้ำ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลประเภทติดตั้งประปา</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลกลุ่มคำร้อง</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลรหัสคำร้อง</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลหมายเหตุการอ่านมาตรวัดน้ำ</a></li>
						</ul>
					</li>
					<li class="menu-last-child  have-sub"><a href="javascript:void()"><i class="fa fa-folder"></i> ตารางรหัสควบคุมระบบ <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลเลขใบแจ้งหนี้</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลหมายเลขใบเสร็จรับเงิน</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลการคิดอัตราค่าน้ำ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> บันทึกข้อมูลพนักงานอ่านมาตรวัดน้ำ</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> ยกเลิกการรับเงินรายกลุ่ม</a></li>
						</ul>
					</li>
				</ul>
			</li>
			<li ><a href="javascript:void()" class="active"><i class="fa fa-briefcase"></i> ทะเบียนผู้ใช้น้ำ <span class="arrow"></span></a>
				<ul class="sub-menu">
					<li><a href="menu-1.html" ><i class="fa fa-folder"></i> เพิ่มทะเบียนผู้ใช้น้ำ</a></li>
					<li><a href="menu-2.html" ><i class="fa fa-folder"></i> แก้ไขทะเบียนผู้ใช้น้ำ</a></li>
					<li><a href="javascript:void()"><i class="fa fa-folder"></i> สถิติการใช้น้ำ <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> สอบถามข้อมูลผู้ใช้น้ำ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> สถิตถการใช้น้ำ</a></li>
						</ul>
					</li>
					<li class="menu-last-child  have-sub"><a href="javascript:void()"><i class="fa fa-folder"></i> รายงานข้อมูลการใช้น้ำ <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานรายละเอียดผู้ใช้น้ำ</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานข้อมูลเงินประกัน</a></li>
						</ul>
					</li>
				</ul>
			</li>
			<li class="active"><a href="javascript:void()"><i class="fa fa-briefcase"></i> อ่านมาตร<span class="arrow"></span></a>
				<ul class="sub-menu">
					<li><a href="menu-3.html" ><i class="fa fa-folder"></i> เตรียมข้อมูลการอ่านมาตร</a></li>
					<li class="active"><a href="menu-4.html"><i class="fa fa-folder"></i> บันทึก/แก้ไขข้อมูลการอ่านมาตร</a></li>
					<li><a href="menu-5.html" ><i class="fa fa-folder"></i> แก้ไขข้อมูลการอ่านมาตร</a></li>
					<li  class="menu-last-child   have-sub"><a href="javascript:void()"><i class="fa fa-folder"></i> รายงานเส้นทางการอ่านน้ำ <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานสถานะเส้นทางการอ่านมาตร</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานข้อมูลการอ่านน้ำ (น้ำสูง)</a></li>
						</ul>
					</li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-briefcase"></i> ลูกหนี้ <span class="arrow"></span></a>
				<ul class="sub-menu">
					<li><a href="javascript:void()"><i class="fa fa-folder"></i> พิมพ์ใบแจ้งหนี้</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> บันทึกข้อมูลใบแจ้งหนี้ (MB) <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="menu-6.html"><i class="fa fa-coffee"></i> บันทึกข้อมูลใบแจ้งหนี้ (MB)</a></li>
							<li><a href="menu-7.html"><i class="fa fa-coffee"></i> แก้ไขข้อมูลใบแจ้งหนี้ (MB)</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> ยกเลิกข้อมูลใบแจ้งหนี้ (MB)</a></li>
						</ul>
					</li>
					<li class="menu-last-child   have-sub"><a href="javascript:void()"><i class="fa fa-folder"></i> รายงานข้อมูลลูกหนี้ <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานเบิกจ่ายใบแจ้งหนี้และใบเสร็จ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานยกเลิกใลแจ้งหนี้</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานการจัดทำใบแจ้งหนี้</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานข้อมูลลูกหนี้</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานค่าน้ำประปาประจำเดือน</a></li>
						</ul>
					</li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-briefcase"></i> รับเงิน <span class="arrow"></span></a>
				<ul class="sub-menu">
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> รับเงินค่าน้ำ <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="menu-8.html"><i class="fa fa-coffee"></i> รับเงินค่าน้ำรายเดี่ยว</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รับเงินค่าน้ำรายกลุ่ม</a></li>
						</ul>
					</li>
					<li><a href="menu-9.html" ><i class="fa fa-folder"></i> รับเงินค่าอื่นๆ</a></li>
					<li><a href="menu-11.html" ><i class="fa fa-folder"></i> ยกเลิกข้อมูลการรับเงิน</a></li>
					<li><a href="javascript:void()"><i class="fa fa-folder"></i> ปิดการรับเงิน <span class="arrow "></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> ปิดการรับเงินประจำวัน</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> ยกเลิกการปิดการรับเงินประจำวัน</a></li>
						</ul>
					</li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> สอบถามข้อมูลการรับเงิน <span class="arrow"></span></a>
						<ul class="sub-menu">
							<li><a href="menu-10.html"><i class="fa fa-coffee"></i> สอบถามตามใบเสร็จ</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> สอบถามตามวันที่รับเงิน</a></li>
						</ul>
					</li>
					<li class="menu-last-child have-sub"><a href="javascript:void()"><i class="fa fa-folder"></i> รายงานการรับเงิน <span class="arrow "></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานก่อนปิดการรับเงินประจำวัน</a></li>
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานหลังปิดการรับเงินประจำวัน</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานสรุปการรับเงินประจำวัน</a></li>
						</ul>
					</li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-coffee"></i> คำร้อง</a>
				<ul class="sub-menu">
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> คำร้องขอติดตั้งประปา</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> คำร้องเกี่ยวกับมาตรวัดน้ำ</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> คำร้องอื่นๆ</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> ยกเลิกคำร้อง</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> สอบถามคำร้อง</a></li>
					<li class="menu-last-child   have-sub"><a href="javascript:void()" ><i class="fa fa-folder"></i> รายงาน <span class="arrow "></span></a>
						<ul class="sub-menu">
							<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานการรับคำร้องประจำวัน</a></li>
							<li class="menu-last-child "><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานสรุปการรับคำร้อง</a></li>
						</ul>
					</li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-coffee"></i> รายงานผู้บริหาร</a>
				<ul class="sub-menu">
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> รายงานรายได้จากการบริการ</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> รายงานสรุปยอดเก็บค่าขยะประจำวัน</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> รายงานสรุปยอดเก็บค่าขยะประจำเดือน</a></li>
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> รายงานสรุปยอดเก็บค่าบำบัดน้ำเสียประจำวัน</a></li>
					<li class="menu-last-child "><a href="javascript:void()" ><i class="fa fa-folder"></i> รายงานสรุปยอดเก็บค่าบำบัดน้ำเสียประจำเดือน</a></li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-coffee"></i> ระงับการใช้น้ำ (ผูกลวด)</a></li>
			<li><a href="javascript:void()"><i class="fa fa-coffee"></i> มาตรครบวาระ</a></li>
			<li><a href="javascript:void()"><i class="fa fa-coffee"></i> MWA Admin <span class="arrow "></span></a>
				<ul class="sub-menu">
					<li><a href="javascript:void()" ><i class="fa fa-folder"></i> กำหนดวันที่ของระบบ</a></li>
					<li class="menu-last-child "><a href="javascript:void()" ><i class="fa fa-folder"></i> บันทึกข้อมูลภาษีมูลค่าเพิ่ม</a></li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-coffee"></i> MWA User <span class="arrow "></span></a>
				<ul class="sub-menu">
					<li class="menu-last-child "><a href="javascript:void()" ><i class="fa fa-folder"></i> จัดทำใบแจ้งค่าบริการรายเดือน</a></li>
				</ul>
			</li>
			<li><a href="javascript:void()"><i class="fa fa-sign-out"></i> ออกจากระบบ</a></li>
		</ul>
	</div>
	<!-- End side-menu-->
	
	<div class="col-sm-12 col-xs-12" id="right-detail">
		<div id="navigator-bar"><i class="fa fa-home"></i> หน้าหลัก <i class="fa fa-angle-right ml-5 mr-5"></i> บันทึกข้อมูลอ่านมาตร</div>
		<!--End navigator-bar-->
		<div >
			<div id="page-header" class="clearfix">
				<div>บันทึกข้อมูลอ่านมาตร</div>
			</div>
			<div class="form-detail clearfix">
				<form role="form">
					<div class="search-box  no-radius">
						<div class="form-group clearfix search-header no-radius">
							<div class="pull-left">ระบุข้อมูลการค้นหา</div>
							<div class="pull-right">
								<div id="hide-button"><i class="fa fa-chevron-circle-up"></i></div>
							</div>
						</div>
						<div id="box-body">
							<div class="form-group clearfix mt-20">
								<div class="col-sm-4 mt-5">
									<label for="exampleInputEmail1">เขต</label>
									<select class="form-control">
										<option>-- เลือก --</option>
									</select>
								</div>
								<div class="col-sm-4 mt-5">
									<label for="exampleInputEmail1">เส้นทาง</label>
									<select class="form-control">
										<option>-- เลือก --</option>
									</select>
								</div>
								<div class="col-sm-4 mt-5">
									<label for="exampleInputEmail1">ทะเบียนผู้ใช้น้ำ</label>
									<input type="text" class="form-control" id="inputPassword3" placeholder="ทะเบียนผู้ใช้น้ำ">
								</div>
							</div>
							<div class="form-group mt-20 clearfix search-footer no-radius">
								<div class="col-sm-12 text-center">
									<button type="submit" class="btn btn-primary"><i class="fa fa-search"></i> ค้นหา้อมูล</button>
								</div>
							</div>
						</div>
					</div>
				</form>
			</div>
			<!-- End form-detail -->
			
			<div class="form-list clearfix" style=" margin-top:-40px">
				<div class="cearfix">
					<h4 class="pull-left"><i class="fa fa-file-text-o"></i> จัดทำข้อมูลใบแจ้งหนี้ ประจำเดือน <span class="comment">04/2557</span></h4>
					<div class="form-group pull-right mt-5">
						<div class="clearfix">	
						    
							<div class='input-group date pull-right' id='datetimepicker1' style="width:200px">
								<input type='text' class="form-control" placeholder="วันที่อ่านน้ำ" />
								<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </span> 
							</div>
							<div class="pull-right mt-5 mr-5">วันที่อ่านน้ำรอบปัจจุบัน : </div>
							
						</div>
					</div>
					<table  class="table-list mt-10" >
						<tr>
							<th rowspan="2" width="5%">ลำดับ</th>
							<th rowspan="2" width="15%">รหัสผู้ใช้น้ำ</th>
							<th colspan="2">ข้อมูลครั้งก่อน</th>
							<th width="15%">ข้อมูลปัจจุบัน</th>
							<th rowspan="2" colspan="2">วิธีการคำนวน</th>
							<th rowspan="2" width="15%">รวมเป็นเงิน</th>
						</tr>
						<tr>
							<th>วันที่อ่านน้ำ</th>
							<th>เลขในมาตร</th>
							<th>เลขในมาตร</th>
						</tr>
						<tr class="odd">
							<td>1</td>
							<td>5300013</td>
							<td>25/04/2557</td>
							<td>1631</td>
							<td class="highlight-blue"><input type="text" class="form-control text-right" id="inputPassword3" placeholder="" value="1800"></td>
							<td width="8%"><input type="radio"  checked="checked" />
								ปกติ</td>
							<td width="8%"><input type="radio" />
								ค่าเฉลี่ย</td>
							<td class="highlight-blue-2" style="text-align:right">749.00 บาท</td>
						</tr>
						<tr class="even">
							<td>2</td>
							<td>5300013</td>
							<td>25/04/2557</td>
							<td>1631</td>
							<td class="highlight-blue"><input type="text" class="form-control text-right" id="inputPassword3" placeholder="" value="1800"></td>
							<td width="8%"><input type="radio"  checked="checked" />
								ปกติ</td>
							<td width="8%"><input type="radio" />
								ค่าเฉลี่ย</td>
							<td class="highlight-blue-2" style="text-align:right">749.00 บาท</td>
						</tr>
						<tr class="odd">
							<td>3</td>
							<td>5300013</td>
							<td>25/04/2557</td>
							<td>1631</td>
							<td class="highlight-blue"><input type="text" class="form-control text-right" id="inputPassword3" placeholder="" value="1800"></td>
							<td width="8%"><input type="radio"  checked="checked" />
								ปกติ</td>
							<td width="8%"><input type="radio" />
								ค่าเฉลี่ย</td>
							<td class="highlight-blue-2" style="text-align:right">749.00 บาท</td>
						</tr>
						<tr class="even">
							<td>4</td>
							<td>5300013</td>
							<td>25/04/2557</td>
							<td>1631</td>
							<td class="highlight-blue"><input type="text" class="form-control text-right" id="inputPassword3" placeholder="" value="1800"></td>
							<td width="8%"><input type="radio"  checked="checked" />
								ปกติ</td>
							<td width="8%"><input type="radio" />
								ค่าเฉลี่ย</td>
							<td class="highlight-blue-2" style="text-align:right">749.00 บาท</td>
						</tr>
						<tr class="odd">
							<td>5</td>
							<td>5300013</td>
							<td>25/04/2557</td>
							<td>1631</td>
							<td class="highlight-blue"><input type="text" class="form-control text-right" id="inputPassword3" placeholder="" value="1800"></td>
							<td width="8%"><input type="radio"  checked="checked" />
								ปกติ</td>
							<td width="8%"><input type="radio" />
								ค่าเฉลี่ย</td>
							<td class="highlight-blue-2" style="text-align:right">749.00 บาท</td>
						</tr>
						<tr class="even">
							<td>6</td>
							<td>5300013</td>
							<td>25/04/2557</td>
							<td>1631</td>
							<td class="highlight-blue"><input type="text" class="form-control text-right" id="inputPassword3" placeholder="" value="1800"></td>
							<td width="8%"><input type="radio"  checked="checked" />
								ปกติ</td>
							<td width="8%"><input type="radio" />
								ค่าเฉลี่ย</td>
							<td class="highlight-blue-2" style="text-align:right">749.00 บาท</td>
						</tr>
					</table>
					<div class="text-center mt-20">
						<button type="submit" class="btn btn-primary"><i class="fa fa-floppy-o"></i> บันทึก</button>
						<button type="submit" class="btn btn-primary"><i class="fa fa-refresh"></i> เริ่มใหม่</button>
					</div>
				</div>
				<!-- End form-list --> 
				
			</div>
			<!-- End detail-area -->
			
			<div id="footer-detail">Copyright © สงวนลิขสิทธิ์ พ.ศ.2557 โดย การประปานครหลวง</div>
		</div>
	</div>
	<!-- End Detail-area--> 
	
</div>
<!-- End Wrapper --> 

<!-- JAVASCRIPT --> 
<script type="text/javascript" src="assets/js/jquery.min.js"></script> 
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script> 
<script type="text/javascript" src="assets/js/bootstrap-datetimepicker.min.js" ></script> 
<script type="text/javascript" src="assets/js/script.js"></script> 

<!-- END JAVASCRIPT -->
</body>
</html>